<template>
    <el-select
            clearable
            :style="{width:width}"
            @change="changeHandle"
            filterable
            allow-create
            v-model="modalSelect">
        <el-option
                v-for="(item,index) in list"
                :key="index"
                :label="item.name"
                :value="item.id">
        </el-option>
    </el-select>
</template>

<script>

    export default {
        name: 'CoachSelect',
        data() {
            return {
                // 是否校验
                validate: false,
                modalSelect: this.value,
                // 列表
                list: []
            }
        },
        props: {
            // 传入的值
            value: {
                type: String,
                default: ''
            },
            width: {
                type: String,
                default: 'auto'
            },
            defaultLabel: {
                type: String,
                default: ''
            },
            canEdit: {
                type: Boolean,
                default: true
            },
        },
        mounted: function () {
            this.modalSelect = this.value;
            this.refresh();
        },
        watch: {
            value: function () {
                this.modalSelect = this.value;
            },
        },
        computed: {
            error: function () {
                if (this.modalSelect === '') {
                    return true;
                }
                return false;
            }
        },
        methods: {
            // 检查
            errorCheck: function () {
                this.validate = true;
                return this.error;
            },
            // 变化时监听
            changeHandle: function () {
                this.$emit('input', this.modalSelect);
                this.$emit('change');
            },
            // 刷新
            refresh: function () {
                this.getList();
            },
            // 获取数据列表
            getList: function () {
                var that = this;
                this.requestList('/class_api/coach', {
                    pageIndex: 0,
                    pageSize: 1000
                }, function (total, list) {
                    that.list = list;
                })
            }
        }
    }
</script>

<style scoped>

</style>
